<!--
*  功能描述：合同与项目综合统计
 -->
<template>
  <div>

    <el-tag style="width: 100%; text-align: left; font-size: 20px"
      >统计条件</el-tag
    >

    <el-form>
        <el-form-item label="生产部门" prop="DName">
        
      <el-select v-model="DName" placeholder="请选择" clearable> 
        <el-option
          v-for="item in Depart"
          :key="item.DepId"
          :value="item.DepName"
          :label="item.DepName"
          ></el-option
        ></el-select
      >
      &nbsp;&nbsp;<el-button type="primary" @click="onsubmit">查询</el-button>
          <el-button type="primary" @click="GetContractExcel" style="background-color:red">导出excel</el-button>
      </el-form-item>
      </el-form>

<el-tag style="width: 100%; text-align: left; font-size: 20px"
      >统计结果</el-tag
    >

    <el-table :data="tableData" border :cell-style="rowClass" :header-cell-style="headClass" style="margin-top:20px;">
      <el-table-column prop="DName" label="生产部门">
      </el-table-column>
      <el-table-column prop="clerkid" label="客户信息">
      </el-table-column>
      <el-table-column prop="proid" label="合同信息">
      </el-table-column>
      <el-table-column prop="conid" label="项目信息">
      </el-table-column>
    </el-table>
  </div>
</template>                                                                 
<script>
export default {
  data () {
    return {
      tableData: [],
      Depart:[],
      DName:'',
    }
  },
  mounted () {
    this.getstatistics();
    this.DeptXl();
    this.onsubmit();
  },
  methods: {
    // 表头样式设置
    headClass () {
      return 'text-align: center;background:rgb(242,242,242);color:rgb(140,138,140)'
    },
    // 表格样式设置
    rowClass () {
      return 'text-align: center;'
    },
    //数据统计
    getstatistics () {
      this.$http({
        url: "LeadingCockpit/GetStatistics",
        method: "get",
        params: {
          DName:this.DName,
        }
      })
        .then(res => {
          this.tableData = res.data;
        })
    },
    onsubmit(){
      this.getstatistics();
          },
    DeptXl() {
      this.$http({
        url: "LeadingCockpit/GetDept",
        method: "Get",
      }).then((res) => {
        this.Depart = res.data;
        console.log(this.data);
      });
    },
    GetContractExcel() {
        window.open("LeadingCockpit/GetExecel")
    },
  }
}
</script>

<style>
</style>